@(missionId: Int)(implicit request: RequestHeader)
@main("任务结果") {

	<link rel="stylesheet" media="screen" href="@routes.Assets.at("stylesheets/plugins.min.css")">

	<script src="@routes.Assets.at("easy-pie-chart-2.1.6/dist/jquery.easypiechart.min.js")" type="text/javascript"></script>
	<script src="@routes.Assets.at("javascripts/App.min.js")" type="text/javascript"></script>
	<script src="@routes.Assets.at("javascripts/plugins.min.js")" type="text/javascript"></script>

	<style>
			.genome-pre {
				white-space: pre-wrap;
				word-wrap: break-word;
				border: 0px solid #ccc;
				background-color: white;
			}

			.mySelected {
				background-color: #c0edf1
			}

			.myTab {
				cursor: pointer;
			}

			pre {
				max-height: 500px;
			}

	</style>

	<div class="row">
		<div class="form-group col-sm-12">
			<h2 class="page-heading"
			style="text-align: left;
				border-bottom: 5px solid #e9f3f4">
				任务结果</h2>
		</div>
	</div>

	<div class="page-content">

		<h4>任务信息</h4>

		<div class="row">

			<div class="col-md-12 col-sm-12">

				<div class="portlet-body" >

					<form class="form-horizontal" role="form" id="mission">
						<div class="form-body">

							<div class="row">
								<div class="form-group">
									<label class="control-label col-md-2">任务名:</label>
									<div class="col-md-4">
										<p class="form-control-static" id="missionName">  </p>
									</div>
								</div>
							</div>

							<div class="row">
								<div class="form-group">
									<label class="control-label col-md-2">开始日期:</label>
									<div class="col-md-4">
										<p class="form-control-static" id="startTime">  </p>
									</div>
									<label class="control-label col-md-2">结束日期:</label>
									<div class="col-md-4">
										<p class="form-control-static" id="endTime">  </p>
									</div>
								</div>

							</div>

							<div class="row">
								<div class="form-group">
									<label class="control-label col-md-2">参数:</label>
									<div class="col-md-4" >
										<table class="display table table-bordered" id="argTable" data-pagination="true"
										data-page-list="[10, 25, 50, 100, all]" >
											<thead>
											</thead>
										</table>
										<p class="form-control-static" id="arg">  </p>

									</div>
									<label class="control-label col-md-2">结果文件:</label>
									<div class="col-md-4">
										<p class="form-control-static" >
											<a href="@routes.CentrifugeController.downloadResult()?missionId=@missionId">
												<i class="fa fa-download"></i>
											</a>
										</p>
									</div>
								</div>

							</div>

						</div>
					</form>

				</div>

			</div>

		</div>

		<h4>结果详情</h4>

		<h5 style="margin-top: 20px">统计结果:
			<a title="下载" href="@routes.CentrifugeController.downloadStatInfo()?missionId=@missionId"><i class="fa fa-download"></i></a>
		</h5>

		<pre id="statString" style="background-color: white"></pre>

		<h5>报告结果:</h5>

		<div class="table-responsive" id="report">

			<div style="display: none;
				margin-bottom: 10px">筛选条件：
				<span id="filterCondition">
				</span>
			</div>

			<div style="display: none;
				margin-bottom: 10px">排序条件：
				<span id="sortCondition">
				</span>
			</div>

			<table class="display table table-bordered" id="table" data-pagination="true"
			data-page-list="[10, 25, 50, 100, all]" >
				<thead>

					<tr class="myTr">

					</tr>

				</thead>
			</table>

			<div id="allFilterContent">

			</div>

		</div>

	</div>


	<script>
			var missionId = "@missionId"

			$(function () {
				MissionResult.init

			})
	</script>


}